<template>
	<view>
		<up-sticky bgColor="#fff">
			<up-tabs lineColor="#4dca7f" lineWidth="100rpx" :current="curTabIndex" :list="tabList"
				@click="click" style="width: 100%;background-color: #4e77cf;" id="tabs-box"
				:activeStyle="{ color: '#fff' }" :inactiveStyle="{ color: '#f7f7f7' }"
				:scrollable="false"></up-tabs>
		</up-sticky>
		<!-- 自提订单 -->
		<carSaleSummary v-show="curTabIndex==0"  ref="carSaleRef">
		</carSaleSummary>

		<!-- 货款 -->
		<transferSummary v-show="curTabIndex===1" ref="transferRef">
		</transferSummary>


		<!-- <drag-button :isDock="true" :existTabBar="true" text="返回" @btnClick="btnClick" /> -->
	</view>
</template>

<script setup>
	import { ref, reactive, watch, nextTick, computed } from 'vue'
	import { onReady, onLoad } from "@dcloudio/uni-app"
	import { useStore } from "vuex";
	import carSaleSummary from './components/carSaleSummary.vue';
	import transferSummary from './components/transferSummary.vue';
	const store = useStore();
	const app = getApp()


	// 创建响应式数据  
	const carSaleRef = ref(null); // 创建ref引用
	const transferRef = ref(null); // 创建ref引用
	const tabList = reactive([
		{ name: '车销订单' },
		{ name: '调拨订单' }
	]);
	const curTabIndex = ref(0)
	const tabsHeight = ref(0)
	onReady(async () => {
		uni.createSelectorQuery().select('#tabs-box').boundingClientRect(t => {
			tabsHeight.value = t.height
			const mainBoxHeight = app.globalData.sysInfo.MAIN_VIEW_HEIGHT - t.height
			if (carSaleRef.value) {
				carSaleRef.value.setMainBoxHeight(mainBoxHeight)
			}
			if (transferRef.value) {
				transferRef.value.setMainBoxHeight(mainBoxHeight)
			}
		}).exec()
	})


	// 合计
	const orderTotalPrice = computed(() => {
		carSaleList.forEach(item => {

		});
		return total;
	})

	// 定义方法  
	function click(item) {
		//console.log('item', item);
		curTabIndex.value = item.index
	}

	// 设置客户
	const setCus = (id, name) => {
		if (carSaleRef.value) {
			carSaleRef.value.setCus(id, name)
		}
	}


	// 悬浮按钮点击返回主页
	const btnClick = () => {
		uni.switchTab({
			url: '/pages/work'
		});
	}


	// 一定要放在最后，不然会报错
	defineExpose({
		setCus
	})
</script>

<style lang="scss">

</style>